import React, { Component } from "react";
// 第三方库，检验props数据类型
import PropTypes from 'prop-types'
export default class three extends Component {
  // 静态属性 是类的一个静态属性，不能在实例上调用只能在类调用
  static propTypes = {
      id:PropTypes.string.isRequired,
      name:PropTypes.string.isRequired,
      itemEvt:PropTypes.func.isRequired
  }
  render(){
    return (
        <ul>
            <li style={{ width: "1000px", height: "30px" ,textAlign:'center' }} >
            <span style={{ width: "200px", height: "30px" ,display:'inline-block'}}>{this.props.id}</span>
            <span style={{ width: "200px", height: "30px" ,display:'inline-block'}}>{this.props.name}</span>
            <span style={{ width: "200px", height: "30px" ,display:'inline-block'}}>{this.props.tc}</span>
            <span style={{ width: "200px", height: "30px" ,display:'inline-block'}}>{this.props.price}</span>
            <span style={{ width: "200px", height: "30px" ,display:'inline-block'}}><button  onClick={this.props.itemEvt.bind(null,this.props.id)}>下单</button></span>
            </li>  
        </ul>
             
           );
  }
}
